<template>
  <b-page class="gkzl">
    <b-loading v-if="!loading"/>
    <div class="real-time-data d-jcs-aic">
      <b-card-data v-for="item in cardList" :key="item.title" v-bind="item"/>
    </div>
  </b-page>
</template>

<script>
  import BCardData from '../../components/b-card-data'
  import API from '../../../api/gameData'
  import BPage from '../../components/b-page'

  export default {
    name: 'Gkzl',
    components: {
        BPage,
      BCardData
    },
    data () {
      return {
        cardList: [
          {
            title: '总参与粉丝',
            todayTitle: '今日参与粉丝',
            tips: '此次活动总参与的用户数',
            dataNum: 0,
            todayDataNum: 0
          },
          {
            title: '总净增粉丝',
            todayTitle: '今日净增粉丝',
            tips: '总参与用户-取关用户-参与活动未取关的老粉丝用户',
            dataNum: 0,
            todayDataNum: 0
          },
          {
            title: '净增好友数',
            todayTitle: '今日净增好友数',
            tips: '净增好友数=总参与用户-已被删好友数',
            dataNum: 0,
            todayDataNum: 0
          },
          {
            title: '裂变率',
            todayTitle: '',
            tips: '裂变率=（总参与粉丝-一级用户）/总参与粉丝',
            dataNum: '5%',
            todayDataNum: 0
          }],
        loading: false
      }
    },
    computed: {
      qwUserId () {
        return this.$store.state.user.info.qwUserId
      }
    },
    mounted () {
      this.getAllData()
    },
    methods: {
      getAllData () {
        API.allData({ qwUserId: this.qwUserId }).then(res => {
          this.loading = true
          // 总净增好友数
          const zjz = res.totalJoinCount - res.totalUnbindFriend
          this.cardList[0].dataNum = res.totalJoinCount
          this.cardList[0].todayDataNum = res.todayJoinCount
          this.cardList[1].dataNum = res.totalJoinCount - res.totalUnfollow
          this.cardList[1].todayDataNum = res.todayJoinCount - res.todayUnfollow
          this.cardList[2].dataNum = zjz
          this.cardList[2].todayDataNum = res.todayJoinCount - res.todayUnbindFriend
          this.cardList[3].dataNum = res.totalJoinCount ? this.$Utils.keepN((res.totalJoinCount - res.oneReferrerLevelCount) / res.totalJoinCount) * 100 + '%' : '0%'
        }).catch(() => {
          this.loading = true
        })
      }
    }
  }
</script>

<style scoped>
  .gkzl {
    height: 100%;
  }
</style>
